<div class="form-field">
   <#if form.mode == "view">
      <div class="viewmode-field">
         <#if field.mandatory && !(field.value?is_number) && field.value == "">
            <span class="incomplete-warning"><img src="${url.context}/res/components/form/images/warning-16.png" title="${msg("form.field.incomplete")}" /><span>
         </#if>
         <span class="viewmode-label">${field.label?html}:</span>
         <#if field.control.params.activateLinks?? && field.control.params.activateLinks == "true">
            <#assign fieldValue=field.value?html?replace("((http|ftp|https):\\/\\/[\\w\\-_]+(\\.[\\w\\-_]+)+([\\w\\-\\.,@?\\^=%&:\\/~\\+#]*[\\w\\-\\@?\\^=%&\\/~\\+#])?)", "<a href=\"$1\" target=\"_blank\">$1</a>", "r")>
         <#else>
            <#if field.value?is_number>
               <#assign fieldValue=field.value?c>
            <#else>
               <#assign fieldValue=field.value?html>
            </#if>
         </#if>
         <span class="viewmode-value"><#if fieldValue == "">${msg("form.control.novalue")}<#else>${fieldValue}</#if></span>
      </div>
   <#else>
      <select id="nodeRefs" name="nodeRefs" multiple="multiple" style="visibility:hidden;height:0px">
		  <option value="empty" selected="selected">empty</option>
	  </select>
	  <label for="${fieldHtmlId}">${field.label?html}:<#if field.mandatory><span class="mandatory-indicator">${msg("form.required.fields.marker")}</span></#if></label>
	  <input id="${fieldHtmlId}" name="${field.name}" tabindex="0"
			 <#if field.control.params.password??>type="password"<#else>type="text"</#if>
			 <#if field.control.params.styleClass??>class="${field.control.params.styleClass}"</#if>
			 <#if field.control.params.style??>style="${field.control.params.style}"</#if>
			 <#if field.value?is_number>value="${field.value?c}"<#else>value="${field.value?html}"</#if>
			 <#if field.description??>title="${field.description}"</#if>
			 <#if field.control.params.maxLength??>maxlength="${field.control.params.maxLength}"</#if> 
			 <#if field.control.params.size??>size="${field.control.params.size}"</#if>
			 <#if field.disabled && !(field.control.params.forceEditable?? && field.control.params.forceEditable == "true")>disabled="true"</#if> />
	  <@formLib.renderFieldHelp field=field />
	  <div id="${fieldHtmlId}-container"></div><br/>
   </#if>
</div>

<script type="text/javascript">//<![CDATA[
(function(){
	
	var element = new YAHOO.util.Element("${fieldHtmlId}");
	
	element.on('contentReady', function() {
		var urlData = new YAHOO.util.XHRDataSource(Alfresco.constants.PROXY_URI + "api/it/custom/searchdest");
		urlData.responseType = YAHOO.util.XHRDataSource.TYPE_JSON;
		urlData.responseSchema = {
			resultsList : "results",
			fields : [
				{ key: "name" },
				{ key: "id" }
			]
		};

		var el = "${fieldHtmlId}";
		var cont = "${fieldHtmlId}-container";
		var myAutoComp = new YAHOO.widget.AutoComplete(el, cont, urlData);
		myAutoComp.forceSelection = true;
		myAutoComp.animSpeed = 0.1;
		myAutoComp.minQueryLength = 3;
		myAutoComp.queryDelay = 1;
		myAutoComp.maxResults = 30;
		
		var fieldName = "nodeRefs";
		var onItemSelect = function(type,args){
			field = YAHOO.util.Dom.get(fieldName).options[0];
			if (field.value.indexOf("&")>-1){
				tmp = document.createElement("div");
			    tmp.innerHTML = field.value;
			    field.value = tmp.textContent||tmp.innerText;
			}
			// setto il campo nascosto che rappresenta l'id
			hiddenfield = YAHOO.util.Dom.get(fieldName).options[0];
			hiddenfield.value = args[2][1];
		}

		myAutoComp.itemSelectEvent.subscribe(onItemSelect);
		
	});
	
	var buttonOk = new YAHOO.util.Element("${fieldHtmlId}-searchAndMoveTo-form-submit-button");
	buttonOk.on('contentReady', function() {
		YAHOO.util.EventProvider.unsubscribeAll("click");
		YAHOO.util.EventProvider.subscribe("click", function(){		
		},buttonOk, false);
	});
	
})();
//]]></script>
